<script setup lang="ts">
import VDialog from "@/components/VDialog/VDialog.vue";
import {computed, ref, reactive, shallowRef, onBeforeUnmount, watch} from "vue";

import {
  ReformMainPageResponse,
  UpdateReformMainCommand,
  updateReformMainApi,
  SirReformDetailEntity,  // 导入整改详情实体类型
  getReformDetailApi      // 导入获取整改详情接口
} from "@/api/airport/reform/reformMain";


const {

} = useReformMainHook();

import { ElMessage, FormInstance, FormRules, ElRow, ElCol } from "element-plus";
import {useUserStoreHook} from "@/store/modules/user";
import {timestamp} from "@vueuse/core";

import {Editor, Toolbar} from "@wangeditor/editor-for-vue";

import {
  editorConfig,
  toolbarConfig,
  viewEditorConfig,
  encodeHtmlToBase64,
  decodeBase64,
} from "@/api/airport/inspection/inspection";


import '@wangeditor/editor/dist/css/style.css'
import {useReformMainHook} from "@/views/airport/reform/reformMain/utils/hook"; // Ensure this import is included


interface Props {
  modelValue: boolean;
  row?: ReformMainPageResponse;
}

const props = defineProps<Props>();
const emits = defineEmits<{
  (e: "update:modelValue", v: boolean): void;
  (e: "success"): void;
}>();

const visible = computed({
  get: () => props.modelValue,
  set(v) {
    emits("update:modelValue", v);
  }
});



// 定义计算属性来安全地绑定表单字段
const code = computed(() => props.row?.code || '');
const problemSource = computed(() => props.row?.problemSource || '');
const problemDetail = computed(() => props.row?.problemDetail || '');
const basis = computed(() => props.row?.basis || '');
const reformRequirement = computed(() => props.row?.reformRequirement || '');
const checkDate = computed(() => props.row?.checkDate || '');
const requestFeedbackDate = computed(() => props.row?.requestFeedbackDate || '');
const correctiveDeadline = computed(() => props.row?.correctiveDeadline || '');
const inspectors = computed(() => props.row?.inspectors || '');
const issueDeptName = computed(() => props.row?.issueDeptName || '');
const dutyDeptName = computed(() => props.row?.dutyDeptName || '');
const directCause = computed(() => props.row?.directCause || '');
const rootCause = computed(() => props.row?.rootCause || '');
const correctiveAction = computed(() => props.row?.correctiveAction || '');
const precautionAction = computed(() => props.row?.precautionAction || '');
const actionMakerName = computed(() => props.row?.actionMakerName || '');
const actionMakeTime = computed(() => props.row?.actionMakeTime || '');
const actionEvalerName = computed(() => props.row?.actionEvalerName || '');
const actionEval = computed(() => props.row?.actionEval || '');
const severity = computed(() => props.row?.severity || '');
const possibility = computed(() => props.row?.possibility || '');
const proofEvalerName = computed(() => props.row?.proofEvalerName || '');
const proofEvalTime = computed(() => props.row?.proofEvalTime || '');
const rectificationOpinion = computed(() => props.row?.rectificationOpinion || '');
const rectificationResult = computed(() => props.row?.rectificationResult || '未进行审核');
const currentStatus = computed(() => {
const isCorrectiveMissing = props.row.correctiveActionProofEvalIsOk === '0' || props.row.correctiveActionProofEvalIsOk == null;
const isPrecautionMissing = props.row.precautionActionProofEvalIsOk === '0' || props.row.precautionActionProofEvalIsOk == null;

  if(isCorrectiveMissing && isPrecautionMissing){
    return '缺少纠正措施和预防措施整改证据';
  }
  else if (isCorrectiveMissing){
    return '缺少纠正措施整改证据';
  }else if(isPrecautionMissing){
    return '缺少预防措施整改证据';
  }

  return rectificationResult || '';
});



// 定义表单数据
const formData = reactive<Partial<UpdateReformMainCommand>>({


});


const formRef = ref<FormInstance>();
const loading = ref(false);

// 新增：整改详情数据和加载状态
const reformDetail = ref<SirReformDetailEntity | null>(null);
const detailLoading = ref(false);
// 新增：展示用编辑器实例
const viewEditorRef = shallowRef();
// const viewEditorConfig = { readOnly: true }; // 配置为只读模式



// 修改：监听弹窗显示状态，增加解码逻辑
watch(() => visible.value, async (newVal) => {
  debugger


  if ((newVal && props.row?.reformStatus === '2' && props.row?.reformId)
    ||(newVal && props.row?.reformStatus === '7' && props.row?.reformId)
    ||(newVal && props.row?.reformStatus === '6' && props.row?.reformId)
    ||(newVal && props.row?.reformStatus === '4' && props.row?.reformId)) {

    formData.selectedProofType = '';
    // 调用接口获取整改详情
    detailLoading.value = true;
    try {
      const { data } = await getReformDetailApi(props.row.reformId);

      // 对字节数组进行解码处理
      if (data.correctiveActionProof) {
        data.correctiveActionProof = decodeBase64(data.correctiveActionProof);
      }
      if (data.precautionActionProof) {
        data.precautionActionProof = decodeBase64(data.precautionActionProof);
      }
      if (data.oldCorrectiveActionProof) {
        data.oldCorrectiveActionProof = decodeBase64(data.oldCorrectiveActionProof);
      }
      if (data.oldPrecautionActionProof) {
        data.oldPrecautionActionProof = decodeBase64(data.oldPrecautionActionProof);
      }


      reformDetail.value = data;
    } catch (error) {
      ElMessage.error('获取整改详情失败');
      console.error('获取整改详情失败', error);
    } finally {
      detailLoading.value = false;
    }
  }

  // 弹窗关闭时
  if (!newVal) {
    reformDetail.value = null; // 弹窗关闭时清空数据
    // 弹窗关闭时，清空formData
    Object.keys(formData).forEach(key => {
      delete formData[key];
    });

  }
});




// 添加计算属性用于动态绑定编辑器内容
const currentProofContent = computed({
  get() {
    if (formData.selectedProofType === 'corrective') {
      return formData.correctiveActionProof || '';
    } else if (formData.selectedProofType === 'precaution') {
      return formData.precautionActionProof || '';
    }
    return '';
  },
  set(value) {
    if (formData.selectedProofType === 'corrective') {
      formData.correctiveActionProof = value;
    } else if (formData.selectedProofType === 'precaution') {
      formData.precautionActionProof = value;
    }
  }
});

// 提交表单
async function handleSubmit() {
  debugger
  const date = new Date();
  const formattedDate = date.toISOString(); // 得到符合格式的字符串

  if (props.row?.reformStatus == '5'||props.row?.reformStatus == '3') {
    // 制定措施逻辑
    if (!formRef.value) return;
    try {
      loading.value = true;
      const userStore = useUserStoreHook(); // 获取用户状态管理实例
      formData.actionMakerName = userStore.currentUserInfo?.username;
      formData.actionMakeTime = formattedDate;
      formData.reformStatus = '1'
      formData.reformId = props.row.reformId;
      await formRef.value.validate();
      await updateReformMainApi(formData as UpdateReformMainCommand);
      ElMessage.success('提交成功');
      emits("success");
      visible.value = false;
    } catch (error) {
      ElMessage.error('提交失败，请重试');
    } finally {
      loading.value = false;
    }
  }else if (props.row?.reformStatus == '1'){
    // 制定措施逻辑
    if (!formRef.value) return;
    try {
      loading.value = true;
      const userStore = useUserStoreHook(); // 获取用户状态管理实例
      formData.actionEvalerName = userStore.currentUserInfo?.username;
      formData.actionEvalTime = formattedDate;
      if(formData.isApprove == '1'){
        formData.reformStatus = '2'
      }else {
        formData.reformStatus = '3'
      }
      formData.reformId = props.row.reformId;
      await formRef.value.validate();
      await updateReformMainApi(formData as UpdateReformMainCommand);
      ElMessage.success('提交成功');
      emits("success");
      visible.value = false;
    } catch (error) {
      ElMessage.error('提交失败，请重试');
    } finally {
      loading.value = false;
    }
  }else if (props.row?.reformStatus == '2'||props.row?.reformStatus == '6'){
    // 初次提交整改效果
    if (!formRef.value) return;
    try {
      loading.value = true;

      const userStore = useUserStoreHook(); // 获取用户状态管理实例

      formData.reformId = props.row.reformId;
      await formRef.value.validate();


      if(formData.selectedProofType === 'corrective'){
        formData.correctiveActionProofUploaderName = userStore.currentUserInfo?.username;
        formData.correctiveActionProofUploadTime = formattedDate
      }else {
        formData.precautionActionProofUploaderName = userStore.currentUserInfo?.username;
        formData.precautionActionProofUploadTime = formattedDate
      }
      // 对字节数组进行解码处理
      if (formData.correctiveActionProof) {
        formData.correctiveActionProof = encodeHtmlToBase64(formData.correctiveActionProof);
      }
      if (formData.precautionActionProof) {
        formData.precautionActionProof = encodeHtmlToBase64(formData.precautionActionProof);
      }


      await updateReformMainApi(formData as UpdateReformMainCommand);
      ElMessage.success('提交成功');
      emits("success");
      visible.value = false;
    } catch (error) {
      ElMessage.error('提交失败，请重试');
    } finally {
      loading.value = false;
    }
  }else if (props.row?.reformStatus == '7'){
    // 制定措施逻辑
    if (!formRef.value) return;
    try {
      loading.value = true;
      const userStore = useUserStoreHook(); // 获取用户状态管理实例
      formData.proofEvalerName = userStore.currentUserInfo?.username;
      formData.proofEvalTime = formattedDate

      if(formData.finalResult == '1'){
        formData.reformStatus = '4'
      }else {
        formData.reformStatus = '6'
      }
      formData.rectificationResult = formData.finalResult
      formData.reformId = props.row.reformId;
      await formRef.value.validate();
      await updateReformMainApi(formData as UpdateReformMainCommand);
      ElMessage.success('提交成功');
      emits("success");
      visible.value = false;
    } catch (error) {
      ElMessage.error('提交失败，请重试');
    } finally {
      loading.value = false;
    }
  }
  else {
    // 制定措施逻辑
    if (!formRef.value) return;
    try {
      loading.value = true;

      emits("success");
      visible.value = false;
    } catch (error) {
      ElMessage.error('提交失败，请重试');
    } finally {
      loading.value = false;
    }
  }



}

// 定义表单验证规则
const rules: FormRules = {
  directCause: [
    {    required: true, message: "请输入直接原因", trigger: "blur" }
  ],
  rootCause: [
    {    required: true, message: "请输入根本原因", trigger: "blur" }
  ],
  correctiveAction: [
    {    required: true, message: "请输入纠正措施", trigger: "blur" }
  ],
  precautionAction: [
    {    required: true, message: "请输入预防措施", trigger: "blur" }
  ],
  actionEval: [
    {    required: true, message: "请输入审核意见", trigger: "blur" }
  ],
  // severity: [
  //   {    required: true, type: 'number', min: 1, max: 5, message: "请输入 1 - 5 之间的数字", trigger: "blur" }
  // ],
  // possibility: [
  //   {    required: true, type: 'number', min: 1, max: 5, message: "请输入 1 - 5 之间的数字", trigger: "blur" }
  // ],

  isApprove: [
    {    required: true, message: "请选择是否通过", trigger: "blur" }
  ],


  correctiveActionProof: [
    {
      required: true,
      message: "请输入纠正措施整改证据",
      trigger: "blur"
    }
  ],
  precautionActionProof: [
    {
      required: true,
      message: "请输入预防措施整改证据",
      trigger: "blur"
    }
  ],
  rectificationOpinion: [
    { required: true, message: "请输入整改审核意见", trigger: "blur" }
  ],
  finalResult: [
    { required: true, message: "请选择整改审核结果", trigger: "change" }
  ]
};

// 编辑器实例和配置
const editorRef = shallowRef();




// 修改：组件销毁时，同时销毁展示用编辑器
onBeforeUnmount(() => {
  const editor = editorRef.value;
  if (editor == null) return;
  editor.destroy();

  // 新增：销毁展示用编辑器
  const viewEditor = viewEditorRef.value;
  if (viewEditor == null) return;
  viewEditor.destroy();
});


const handleCreated = (editor) => {
  editorRef.value = editor; // 记录 editor 实例
};





</script>

<template>
  <v-dialog
    show-full-screen
    :fixed-body-height="false"
    use-body-scrolling
    title="整改通知书详情"
    v-model="visible"
    :loading="loading"
    @confirm="handleSubmit"
    @cancel="visible = false"
  >
    <el-form :model="formData" label-width="180px" :rules="rules" ref="formRef">
      <!-- 整改基本内容，常驻 -->

      <div>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="整改通知书编号：">
              <span>{{ code }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="问题来源：">
              <span>{{ problemSource }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="检查日期：">
              <span>{{ checkDate }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="提交整改期限：">
              <span>{{ requestFeedbackDate }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="完成整改期限：">
              <span>{{ correctiveDeadline }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="督察员：">
              <span>{{ inspectors }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="督察部门：">
              <span>{{ issueDeptName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="责任部门：">
              <span>{{ dutyDeptName }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <!-- 新增：展示历史整改证据 -->
        <el-row  :gutter="20">
          <!-- 纠正措施整改证据展示 -->
          <el-col :span="23" >
            <el-form-item label="问题描述：">
              <div style="border: 1px solid #ccc; width: 100%; min-height: 150px;">
                <Editor
                  style="height: auto; min-height: 150px; width: 100%;"
                  v-model="problemDetail"
                  :defaultConfig="viewEditorConfig"
                  mode="default"
                  @onCreated="editor => viewEditorRef?.value !== undefined && (viewEditorRef.value = editor)"
                />
              </div>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="整改要求：">
              <span>{{ reformRequirement }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="规章制度依据：">
              <span>{{ basis }}</span>
            </el-form-item>
          </el-col>
        </el-row>
      </div>


      <template v-if="props.row?.reformStatus === '5'">
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="直接原因：" prop="directCause">
              <el-input v-model="formData.directCause" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="根本原因：" prop="rootCause">
              <el-input v-model="formData.rootCause" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="纠正措施：" prop="correctiveAction">
              <el-input v-model="formData.correctiveAction" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="预防措施：" prop="precautionAction">
              <el-input v-model="formData.precautionAction" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>
      </template>

      <template v-if="props.row?.reformStatus === '3'">

<!--        <el-row :gutter="20">-->
<!--          <el-col :span="12">-->
<!--            <el-form-item label="安全性：">-->
<!--              <span>{{ severity }}</span>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
<!--          <el-col :span="12">-->
<!--            <el-form-item label="可能性：">-->
<!--              <span>{{ possibility }}</span>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
<!--        </el-row>-->
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="措施审核人：">
              <span>{{ actionEvalerName }}</span>
            </el-form-item>
          </el-col>
        </el-row>


        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="历史直接原因：">
              <span>{{ directCause  }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="历史根本原因：">
              <span>{{ rootCause  }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="历史纠正措施：">
              <span>{{ correctiveAction  }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="历史预防措施：">
              <span>{{ precautionAction  }}</span>
            </el-form-item>
          </el-col>
        </el-row>



        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="措施审核意见：">
              <span>{{ actionEval }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="20">
            <el-form-item label="直接原因：" prop="directCause">
              <el-input v-model="formData.directCause" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="20">
            <el-form-item label="根本原因：" prop="rootCause">
              <el-input v-model="formData.rootCause" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="20">
            <el-form-item label="纠正措施：" prop="correctiveAction">
              <el-input v-model="formData.correctiveAction" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="20">
            <el-form-item label="预防措施：" prop="precautionAction">
              <el-input v-model="formData.precautionAction" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>
      </template>

      <template v-if="props.row?.reformStatus === '1'">
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="直接原因：">
              <span>{{ directCause }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="根本原因：">
              <span>{{ rootCause }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="纠正措施：">
              <span>{{ correctiveAction }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="预防措施：">
              <span>{{ precautionAction }}</span>
            </el-form-item>
          </el-col>
        </el-row>



        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="措施制定人：">
              <span>{{ actionMakerName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="措施制定时间：">
              <span>{{ actionMakeTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>



        <el-form-item label="审核意见：" prop="actionEval">
          <el-input v-model="formData.actionEval" type="textarea" rows="4" />
        </el-form-item>
<!--        <el-form-item label="严重性：" prop="severity">-->
<!--          <el-input-number v-model="formData.severity" :min="1" :max="5" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="可能性：" prop="possibility">-->
<!--          <el-input-number v-model="formData.possibility" :min="1" :max="5" />-->
<!--        </el-form-item>-->
        <el-form-item label="是否通过：" prop="isApprove">
          <el-radio-group v-model="formData.isApprove">
            <el-radio label="1">是</el-radio>
            <el-radio label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>

      </template>

      <template v-if="props.row?.reformStatus === '2'||props.row?.reformStatus === '6'">
        <el-form-item label="直接原因：">
          <span>{{ directCause }}</span>
        </el-form-item>
        <el-form-item label="根本原因：">
          <span>{{ rootCause }}</span>
        </el-form-item>
        <el-form-item label="纠正措施：">
          <span>{{ correctiveAction }}</span>
        </el-form-item>
        <el-form-item label="预防措施：">
          <span>{{ precautionAction }}</span>
        </el-form-item>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="措施制定人：">
              <span>{{ actionMakerName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="措施制定时间：">
              <span>{{ actionMakeTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>

<!--        <el-row :gutter="20">-->
<!--          <el-col :span="12">-->
<!--            <el-form-item label="安全性：">-->
<!--              <span>{{ severity }}</span>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
<!--          <el-col :span="12">-->
<!--            <el-form-item label="可能性：">-->
<!--              <span>{{ possibility }}</span>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
<!--        </el-row>-->
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="措施审核人：">
              <span>{{ actionEvalerName }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="措施审核意见：">
              <span>{{ actionEval }}</span>
            </el-form-item>
          </el-col>
        </el-row>


        <!-- 新增：展示历史整改证据 -->
        <el-row v-if="reformDetail && !detailLoading" :gutter="20">
          <!-- 纠正措施整改证据展示 -->
          <el-col :span="23" v-if="reformDetail.oldCorrectiveActionProof">
            <el-form-item label="历史纠正措施整改证据：">
              <div style="border: 1px solid #ccc; width: 100%; min-height: 150px;">
                <Editor
                  style="height: auto; min-height: 150px; width: 100%;"
                  v-model="reformDetail.oldCorrectiveActionProof"
                  :defaultConfig="viewEditorConfig"
                  mode="default"
                  @onCreated="editor => viewEditorRef?.value !== undefined && (viewEditorRef.value = editor)"
                />
              </div>
            </el-form-item>
          </el-col>

          <!-- 预防措施整改证据展示 -->
          <el-col :span="23" v-if="reformDetail.oldPrecautionActionProof">
            <el-form-item label="历史预防措施整改证据：">
              <div style="border: 1px solid #ccc; width: 100%; min-height: 150px;">
                <Editor
                  style="height: auto; min-height: 150px; width: 100%;"
                  v-model="reformDetail.oldPrecautionActionProof"
                  :defaultConfig="viewEditorConfig"
                  mode="default"
                  @onCreated="editor => viewEditorRef?.value !== undefined && (viewEditorRef.value = editor)"
                />
              </div>
            </el-form-item>
          </el-col>
        </el-row>


        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="历史整改实施审核结果：">
              <el-tag v-if="rectificationResult === '1'">整改通过</el-tag>
              <el-tag v-else-if="rectificationResult === '2'" type="danger">整改不通过-驳回纠正措施</el-tag>
              <el-tag v-else-if="rectificationResult === '3'" type="danger">整改不通过-驳回预防措施</el-tag>
              <el-tag v-else-if="rectificationResult === '4'" type="danger">整改不通过-驳回所有</el-tag>
              <el-tag v-else-if="rectificationResult === '4'" type="danger">整改不通过-驳回所有</el-tag>
              <el-tag v-else="" type="info">无</el-tag>

            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="当前状态：" class="bold-label">
              <span class="bold-text">{{ currentStatus }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20" v-if="props.row?.reformStatus === '6'">
          <el-col :span="23">
            <el-form-item label="整改效果驳回理由：">
              <span>{{ rectificationOpinion }}</span>
            </el-form-item>
          </el-col>
        </el-row>



        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="提交措施类型：" prop="selectedProofType">
              <el-radio-group v-model="formData.selectedProofType">
                <el-radio label="corrective">提交纠正措施整改证据</el-radio>
                <el-radio label="precaution">提交预防措施整改证据</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row v-if="formData.selectedProofType" :gutter="20">
          <el-col :span="23">
            <el-form-item
              :label="formData.selectedProofType === 'corrective' ? '纠正措施整改证据：' : '预防措施整改证据：'"
              :prop="formData.selectedProofType === 'corrective' ? 'correctiveActionProof' : 'precautionActionProof'"
            >
              <div style="border: 1px solid #ccc; width: 100%;">
                <Toolbar
                  style="border-bottom: 1px solid #ccc"
                  :editor="editorRef"
                  :defaultConfig="toolbarConfig"
                  mode="default"
                />
                <Editor
                  style="height: 250px; width: 100%; overflow-y: hidden;"
                  v-model="currentProofContent"
                  :defaultConfig="editorConfig"
                  mode="default"
                  @onCreated="handleCreated"
                />
              </div>
            </el-form-item>
          </el-col>
        </el-row>



      </template>


      <template v-if="props.row?.reformStatus === '7'">
        <el-form-item label="直接原因：">
          <span>{{ directCause }}</span>
        </el-form-item>
        <el-form-item label="根本原因：">
          <span>{{ rootCause }}</span>
        </el-form-item>
        <el-form-item label="纠正措施：">
          <span>{{ correctiveAction }}</span>
        </el-form-item>
        <el-form-item label="预防措施：">
          <span>{{ precautionAction }}</span>
        </el-form-item>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="措施制定人：">
              <span>{{ actionMakerName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="措施制定时间：">
              <span>{{ actionMakeTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>

<!--        <el-row :gutter="20">-->
<!--          <el-col :span="12">-->
<!--            <el-form-item label="安全性：">-->
<!--              <span>{{ severity }}</span>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
<!--          <el-col :span="12">-->
<!--            <el-form-item label="可能性：">-->
<!--              <span>{{ possibility }}</span>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
<!--        </el-row>-->
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="措施审核人：">
              <span>{{ actionEvalerName }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="措施审核意见：">
              <span>{{ actionEval }}</span>
            </el-form-item>
          </el-col>
        </el-row>


        <!-- 新增：展示历史整改证据 -->
        <el-row v-if="reformDetail && !detailLoading" :gutter="20">
          <!-- 纠正措施整改证据展示 -->
          <el-col :span="23" v-if="reformDetail.correctiveActionProof">
            <el-form-item label="历史纠正措施整改证据：">
              <div style="border: 1px solid #ccc; width: 100%; min-height: 150px;">
                <Editor
                  style="height: auto; min-height: 150px; width: 100%;"
                  v-model="reformDetail.correctiveActionProof"
                  :defaultConfig="viewEditorConfig"
                  mode="default"
                  @onCreated="editor => viewEditorRef?.value !== undefined && (viewEditorRef.value = editor)"
                />
              </div>
            </el-form-item>
          </el-col>

          <!-- 预防措施整改证据展示 -->
          <el-col :span="23" v-if="reformDetail.precautionActionProof">
            <el-form-item label="历史预防措施整改证据：">
              <div style="border: 1px solid #ccc; width: 100%; min-height: 150px;">
                <Editor
                  style="height: auto; min-height: 150px; width: 100%;"
                  v-model="reformDetail.precautionActionProof"
                  :defaultConfig="viewEditorConfig"
                  mode="default"
                  @onCreated="editor => viewEditorRef?.value !== undefined && (viewEditorRef.value = editor)"
                />
              </div>
            </el-form-item>
          </el-col>
        </el-row>


        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="历史整改实施审核结果：">
              <el-tag v-if="rectificationResult === '1'">整改通过</el-tag>
              <el-tag v-else-if="rectificationResult === '2'" type="danger">整改不通过-驳回纠正措施</el-tag>
              <el-tag v-else-if="rectificationResult === '3'" type="danger">整改不通过-驳回预防措施</el-tag>
              <el-tag v-else-if="rectificationResult === '4'" type="danger">整改不通过-驳回所有</el-tag>
              <el-tag v-else-if="rectificationResult === '4'" type="danger">整改不通过-驳回所有</el-tag>
              <el-tag v-else="" type="info">无</el-tag>

            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="整改审核意见：" prop="rectificationOpinion">
              <el-input v-model="formData.rectificationOpinion" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>


        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="整改审核结果：" prop="finalResult">
              <el-radio-group v-model="formData.finalResult">
                <el-radio label="1">整改通过</el-radio>
                <el-radio label="2">整改不通过-驳回纠正措施</el-radio>
                <el-radio label="3">整改不通过-驳回预防措施</el-radio>
                <el-radio label="4">整改不通过-驳回所有</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
      </template>

      <template v-if="props.row?.reformStatus === '4'">
        <el-form-item label="直接原因">
          <span>{{ directCause }}</span>
        </el-form-item>
        <el-form-item label="根本原因">
          <span>{{ rootCause }}</span>
        </el-form-item>
        <el-form-item label="纠正措施">
          <span>{{ correctiveAction }}</span>
        </el-form-item>
        <el-form-item label="预防措施">
          <span>{{ precautionAction }}</span>
        </el-form-item>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="措施制定人">
              <span>{{ actionMakerName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="措施制定时间">
              <span>{{ actionMakeTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>

<!--        <el-row :gutter="20">-->
<!--          <el-col :span="12">-->
<!--            <el-form-item label="安全性">-->
<!--              <span>{{ severity }}</span>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
<!--          <el-col :span="12">-->
<!--            <el-form-item label="可能性">-->
<!--              <span>{{ possibility }}</span>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
<!--        </el-row>-->
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="措施审核人">
              <span>{{ actionEvalerName }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="措施审核意见">
              <span>{{ actionEval }}</span>
            </el-form-item>
          </el-col>
        </el-row>


        <!-- 新增：展示历史整改证据 -->
        <el-row v-if="reformDetail && !detailLoading" :gutter="20">
          <!-- 纠正措施整改证据展示 -->
          <el-col :span="23" v-if="reformDetail.correctiveActionProof">
            <el-form-item label="历史纠正措施整改证据">
              <div style="border: 1px solid #ccc; width: 100%; min-height: 150px;">
                <Editor
                  style="height: auto; min-height: 150px; width: 100%;"
                  v-model="reformDetail.correctiveActionProof"
                  :defaultConfig="viewEditorConfig"
                  mode="default"
                  @onCreated="editor => viewEditorRef?.value !== undefined && (viewEditorRef.value = editor)"
                />
              </div>
            </el-form-item>
          </el-col>

          <!-- 预防措施整改证据展示 -->
          <el-col :span="23" v-if="reformDetail.precautionActionProof">
            <el-form-item label="历史预防措施整改证据">
              <div style="border: 1px solid #ccc; width: 100%; min-height: 150px;">
                <Editor
                  style="height: auto; min-height: 150px; width: 100%;"
                  v-model="reformDetail.precautionActionProof"
                  :defaultConfig="viewEditorConfig"
                  mode="default"
                  @onCreated="editor => viewEditorRef?.value !== undefined && (viewEditorRef.value = editor)"
                />
              </div>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="整改效果审核人：">
              <span>{{ proofEvalerName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="整改效果审核时间：">
              <span>{{ proofEvalTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="整改效果审核意见：">
              <span>{{ rectificationOpinion }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="23">
            <el-form-item label="整改实施审核结果：">
              <el-tag v-if="rectificationResult === '1'">整改通过</el-tag>
              <el-tag v-else-if="rectificationResult === '2'" type="danger">整改不通过-驳回纠正措施</el-tag>
              <el-tag v-else-if="rectificationResult === '3'" type="danger">整改不通过-驳回预防措施</el-tag>
              <el-tag v-else-if="rectificationResult === '4'" type="danger">整改不通过-驳回所有</el-tag>
            </el-form-item>
          </el-col>
        </el-row>


      </template>





    </el-form>
  </v-dialog>
</template>


<style scoped>
.bold-label {
  font-weight: bold;  /* 为 label 设置加粗 */
}

.bold-text {
  font-weight: bold;  /* 为内容设置加粗 */
}
</style>
